<script lang="ts" setup>
import DetailDialog from "./components/detail-dialog.vue";
import Filter from "./components/filter.vue";
import Handler from "./components/handler.vue";
import Sheet from "./components/sheet.vue";
import { createState } from "./state";

definePage({
	meta: { title: "隐患排查标准", order: 3 },
});
defineOptions({ name: "IndexPage" });
const { page, detailDialogRef } = createState();
</script>

<template>
	<div
		class="investigationContent"
		p="20px"
		m="20px"
		of="hidden"
		bg="#fff"
		rd="4px"
	>
		<Filter />
		<page-content p="0px" pl="40px" pr="20px" m="0px">
			<template #header>
				<Handler />
			</template>
			<Sheet />
			<DetailDialog ref="detailDialogRef" />
			<template #footer>
				<el-pagination
					v-model:current-page="page.currentPage.value"
					v-model:page-size="page.pageSize.value"
					:disabled="page.isLoading.value"
					:total="page.total.value"
				/>
			</template>
		</page-content>
	</div>
</template>

<style lang="scss" scoped>
.investigationContent {
	display: flex;
	width: 100%;
	height: 100%;
	.filter-form {
		border-right: 1px solid #cccccc;
	}
}
</style>
